@charset "utf-8";
@import "reset";
@import "header";
@import "footer";
@import "common";

section{
    padding-top: r(88px);
    padding-bottom: r(96px); 
    .classbanner{
        margin-top: r(7px);
        position: relative;
        .classbanner-warp{
             
            img{
                width: r(640px);
                height: r(222px);
            }
            
        }
        
        .classbtn{
            top: r(151px);
            left: r(28px);
            position: absolute;
            width: r(305px);
            background-color: white;
//          a{
//              display: block;
//              width: 100%;
//              height: 100%;
//              position: absolute;
//              top: 0;
//              right: 0;
                p:first-of-type{
                    width: r(242px);
                    height: r(57px);
                    text-align: center;
                    line-height: r(57px);
                    font-size: r(25px);
                    color: #b20000;
                }
                .right{
                    width: r(62px);
                    height: r(50px);
                    border-left: r(1px) solid #b20000;
                    margin-top: r(4px);
                    img{
                        width: r(21px);
                        height: r(41px);
                        margin: r(4px) auto 0 auto;
                        display: block;
                    }
                }
//      }
        }
        
    }
    
    .indexlogo{
        margin :{
            top: r(14px);
            left: r(27px);
        }
        img{
            width: r(125px);
            height: r(17px);
            display: block;
        }
    }
    .mamalogo{
        margin :{
            top: r(13px);
            left: r(8px);
            
        }
        border-left:r(1px) solid $bordercolor;
        padding-left: r(7px); 
        img{
            width: r(65px);
            height: r(23px);
            display: block;
        }
    }
//  轮播区域
.banner{
    position: relative;
    .bannerwarp{
        margin-top: r(14px);
//      position: relative;
        img{
            display: block;
            width: 100%;
            height: r(306px);
        }
    }
//  轮播信息
    .bannerinfo{
        width: 100%;
        height: r(104px);
        position: absolute;
        left: 0;
        top: r(202px);
        background-color: black;
        opacity: .6;
        .textflow{
            margin-top: r(25px);
            width: r(586px);
//          box-sizing: border-box;
            font-size: r(27px);
            height: r(27px);
            color: white;
            max-height: r(27px);
            line-height: r(27px);
            display: -webkit-box;
            -webkit-box-orient: vertical;    
            -webkit-line-clamp: 1;  
            
            overflow: hidden;
            text-overflow: ellipsis;
            margin: {
                left: r(30px);
                right: r(24px);
                
            }
            
            
        }
        
        .infobottom{
            width: r(589px);    
            height: r(17px);
            font-size: 0;
            margin: {
                top: r(22px);
                left: r(30px);
                
            }
//          width
            .icon-aixin{
                color: white;
                font-size: r(17px);
            }
            .icon-CombinedShape-{
                color: white;
                font-size: r(17px);
                margin-left: r(49px);
            }
            .time{
                color: white;
                font-size: r(17px);
            }
        }
        
//      小圆点
        .bannerbar{
            width: 100%;
            position: absolute;
            height: r(10px);
            font-size: 0;
            top: r(79px);
            left: 0;
            height: r(10px);
            ul{
                text-align: center;
                .active{
                    background-color: $maincolor;
                }
                li{
                    height: r(10px);
                    width: r(10px);
                    border-radius: 50%;
                    display: inline-block;
                    margin-right: r(12px);
                    background-color: #cebdb2;
                    &:last-of-type{
                        margin-right: 0;
                    }
                }
            }
        }
        
        
    }
    
    
    
  }
  
  .content{
      width: r(583px);
      margin: r(44px) auto 0 auto;
      
      .cell{
          width: 100%;
          margin-top: r(47px);
          padding-bottom: r(32px);
          border-bottom: r(1px) solid $bordercolor;
          &:first-of-type{
              margin-top: 0;
              
          }
          .cell-warp{
              width: r(210px);
              img{
                  width: r(210px);
                  height: r(142px);
                  display: block;
              }
          }
          
          .right{
              p:first-of-type{
                  width: r(358px);
                  font-size: r(22px);
                  line-height: r(26px);
                  
              }
              p:nth-of-type(2){
                  width: r(358px);
                  margin-top: r(6px);
                  color: #c9c9c9;
                  font-size: r(20px);
                  line-height: r(25px);
              }
              p:nth-of-type(3){
//                height: r(16px);
                  font-size: r(16px);
                  color: #939393;
                  text-align: right;
                  margin-top: r(20px);
                  span{
                      font-size: r(16px);   
                  }
              }
          }
          
          
          
      }
      
  }
  
  .more{
        width: 100%;
//      height: ;
        font-size: 0;
        
        text-align: center;
        
        a{
            width: 100%;
            height: 100%;
            color: #bbbbbb;
            font-size: r(22px); 
            line-height: r(73px);
            display: block;
            width: 100%;
            height: 100%; 
        }
    }
    
}
